<template>
	<gui-page class="gui-bg-white">
		<template v-slot:gBody>
			<cardHeader
				:title="`${devname}-${devtype}-设备id=${devid}-属性名=${fieldtitle}-数据域=${field}-(记录总数：${total} ,第${page}页/共${pagecount}页)`">
			</cardHeader>
			<view class="gui-bg-white gui-dark-bg-level-3 gui-padding gui-margin-top">
				<view v-for="(item,index) in items" :key="item.id">
					<cardBody :icon="'&#xe639;'" :title="`${item.fieldValue*ctbbxx}`"
						:value="`[id=${item.id}]${item.update_time}`" :icon-class="'gui-color-blue'"></cardBody>
				</view>
			</view>
			<cardFooter
				:description="`属性名=${fieldtitle} - 数据域=${field} 记录总数：${total} , 第${page}页/共${pagecount}页 - 每页：${perpage}`"
				@golastpage="golastpage"
				@gonextpage="gonextpage"
			></cardFooter>
		</template>
	</gui-page>
</template>

<script setup>
	import { ref,getCurrentInstance,createApp } from 'vue'
	import { onLoad,onPullDownRefresh } from '@dcloudio/uni-app'
	import ybmethod from '../../lib/js/ybmethod';
	import ybgolbal from '../../lib/js/ybgolbal';
	import cardHeader from "@/lib/components/card-header.vue"
	import cardFooter from "@/lib/components/card-footer.vue"
	import cardBody from "@/lib/components/card-body.vue"
	import guiPage from "@/Grace6/components/gui-page.vue"
	const app = createApp();
	const ybapi = ybgolbal.getybapi(getCurrentInstance());
	let ctbb = ref(0);
	let ctbbxx = ref(1);
	let devid = ref(0);
	let devname = ref('');
	let devtype = ref('');
	let rtid = ref(0);
	let field = ref('');
	let fieldtitle = ref('');
	let mc = ref('');
	let xlh = ref('');
	let items = ref([]);
	let page = ref(1);
	let perpage = ref(20);
	let total = ref(0);
	let pagecount = ref(0);
	onLoad((option)=>{
		console.log("进入数据域页面");
		console.log(option);
		ctbb.value = option.ctbb;
		ctbbxx.value = option.ctbbxx;
		devid.value = option.devid;
		devname.value = option.devname;
		devtype.value = option.devtype;
		rtid.value = option.rtid;
		field.value = option.field;
		fieldtitle.value = option.fieldtitle;
		mc.value = option.mc;
		xlh.value = option.xlh;
		getData();
	})
	onPullDownRefresh(()=>{
		ybmethod.onPullDownRefresh(getData);
	})
	function getData(){
		ybapi.Devices_GetRTData(devid.value,xlh.value,"id desc",field.value + " as fieldValue,update_time,id",page.value, perpage.value,
		function(data) {
			if (data.total > 0) {
				total.value = data.total;
				pagecount.value = ybmethod.divideWithRemainderPlusOne(data.total, perpage.value);
				items.value = data.items;
				console.log(items.value)
			}
		},function(e) {
			console.log(e);
		});
	}
	function golastpage(){
		if (page.value > 1) {
			page.value = page.value - 1;
		}
		ybapi.Devices_GetRTData(devid.value, xlh.value, "id desc", field.value +
			" as fieldValue,update_time,id", page.value, perpage.value,
			function(data) {
				if (data.total > 0) {
					total.value = data.total;
					pagecount.value = ybmethod.divideWithRemainderPlusOne(data.total, perpage.value);
					items.value = {};
					items.value = data.items;
				}
			},
			function(e) {
				console.log(e);
			});
	}
	function gonextpage(){
		page.value = page.value + 1;
		ybapi.Devices_GetRTData(devid.value, xlh.value, "id desc", field.value +
			" as fieldValue,update_time,id", page.value, perpage.value,
			function(data) {
				if (data.total > 0) {
					total.value = data.total;
					pagecount.value = ybmethod.divideWithRemainderPlusOne(data.total, perpage.value);
					items.value = {};
					items.value = data.items;
				}
			},
			function(e) {
				console.log(e);
			});
	}
	app.component({
		cardHeader,
		cardBody,
		cardFooter,
		guiPage
	});
</script>

<style>
	       
</style>
